/**
 * Created by Administrator on 2017/4/6.
 */
window.onload=function () {
  var og=document.getElementById('canvas');
  var ogc=og.getContext('2d');
  var i=0;

  og.onclick=function () {
    i=399;
  };
    document.body.onkeydown=function () {
        i=399;
    };
//初始载入动画
    var itl=setInterval(function () {
        ogc.clearRect(0,0,og.width,og.height);//重复清空画布
        animation_showing(i);
        i=i+1;
        if(i==400){//当动画结束（无论手动自动），清空计时器，调用动画结束方法
            clearInterval(itl);
            animation_end();
            choose();
        }

        ogc.stroke();
        ogc.closePath();
    },5);
    //动态绘制横幅方法
    function animation_showing(i) {
        //横幅
        ogc.beginPath();
        ogc.fillRect(0,0,1000,i);
        ogc.fillStyle="#444";
        ogc.beginPath();
        ogc.moveTo(0,i);
        ogc.lineTo(1000,i);
        ogc.stroke();
        ogc.closePath();
    }
    function animation_end() {
        //重新绘制横幅
        animation_showing(400);
        //绘制文字
        ogc.beginPath();
        ogc.font = "30px Courier New";
        ogc.fillStyle = "#000";
        ogc.fillText("新游戏", 300, 500);
        ogc.closePath();

        ogc.beginPath();
        ogc.font = "30px Courier New";
        ogc.fillStyle = "#ccc";
        ogc.fillText("继续游戏", 600, 500);
        console.log("动画结束");
        ogc.closePath();
    }
    function choose() {
        setTimeout(function () {
            //ogc.clearRect(0,0,og.width,og.height);
        },1)
    }
};